<template>
	<div>
		<div class="box">
			<div class="title">上牌</div>
			<div class="">
				<FormItems
					ref="form"
					v-model="formData"
					:form="formList"
					:state="state"
					labelWidth="140px"></FormItems>
			</div>
		</div>
	</div>
</template>

<script>
	import FormItems from '@/views/finance/manage/formItems/index.vue';
	import FormItem from '@/views/finance/reimburs/formItem/index.vue';
	export default {
		components: { FormItems, FormItem },
		dicts: ['quota_maintenance_meal'],
		props: {
			value: {
				required: false,
			},
			state: {
				required: false,
			},
			type: {
				required: false,
			},
		},
		inject: ['details_forecast', 'deptList', '_cityList', '_index'],

		data() {
			return {};
		},
		computed: {
			formData: {
				get() {
					return this.useVModel.call(this);
				},
				set(val) {
					this.$emit('input', val);
				},
			},
			details() {
				return this.details_forecast();
			},
			cityList() {
				return this._cityList?.() ?? [];
			},
			index() {
				return this._index();
			},
			formList() {
				return [
					// {
					//     label: "上牌城市",
					//     placeholder: "请输入上牌城市",
					//     type: "select",
					//     selectList: this.cityList,
					//     selectLabel: "regionName",
					//     selectValue: "regionId",
					//     prop: "carLicenseCityKey",
					//     rules: [
					//         {
					//             required: true,
					//             message: "请选择上牌城市",
					//             trigger: "change",
					//         },
					//     ],
					//     event: {
					//         type: "change",
					//         cb: (row) => {
					//             let item = this.cityList.find(
					//                 (e) => e.regionId == row.carLicenseCityKey
					//             );
					//             this.formData.carLicenseCityVal = item.regionName;
					//         },
					//     },
					// },
					{
						label: '上牌城市',
						type: 'select',
						selectList: this.deptList.company,
						selectLabel: 'deptName',
						selectValue: 'deptId',
						prop: 'carLicenseCityKey',
						rules: true,
						event: {
							type: 'change',
							cb: row => {
								let item = this.deptList.company.find(
									e => e.deptId == row.carLicenseCityKey,
								);
								if (item) {
									let regionId = item.regionId.split('/');
									this.formData.carCalcCityKey =
										regionId?.[1];
									this.formData.carLicenseCityVal =
										item.deptName;
								}
							},
						},
					},
					{
						label: '开发城市',
						type: 'select',
						selectList: this.deptList.company,
						selectLabel: 'deptName',
						selectValue: 'deptId',
						prop: 'carAffiliationKey',
						rules: true,
						event: {
							type: 'change',
							cb: row => {
								let item = this.deptList.company.find(
									e => e.deptId == row.carAffiliationKey,
								);
								this.formData.carAffiliationVal =
									item?.deptName;
							},
						},
					},
					{
						label: '运营城市',
						placeholder: '请输入运营城市',
						type: 'input',
						prop: 'carOperateCityVal',
						rules: true,
					},
					{
						label: '车辆产权方',
						type: 'input',
						prop: 'propertyOwner',
						// rules: true,
						show: this.details?.carSourceType == '3',
					},
					// {
					//     label: "上牌费（台）",
					//     placeholder: "请输入金额",
					//     type: "input_number",
					//     prop: "carLicensePrice",
					//     show:
					//         this.details.carSourceType == "1" &&
					//         this.details.outsourcingType == "1",
					// },
					// {
					//     label: "限牌城市牌照费（台）",
					//     placeholder: "请输入金额",
					//     type: "input_number",
					//     prop: "carLicenseCityPrice",
					//     show:
					//         this.details.carSourceType == "1" &&
					//         this.details.outsourcingType == "1",
					// },
					// {
					//     label: "购置税（台）",
					//     placeholder: "请输入金额",
					//     type: "input_number",
					//     prop: "carPurchaseTax",
					//     show:
					//         this.details.carSourceType == "1" &&
					//         this.details.outsourcingType == "1",
					// },
				];
			},
		},
		created() {},
		beforeDestroy() {
			if (this.notEmpty(this.details?.productList?.[this.index])) {
				this.$refs.form?.form_resetFields?.();
			}
		},
		mounted() {},
		methods: {
			valid() {
				return new Promise(async resolve => {
					let result = true;
					let refs = Object.values(this.$refs);
					for (let index = 0; index < refs?.length; index++) {
						const ref = refs[index];
						if (
							Object.prototype.toString.call(ref) ==
							'[object Array]'
						) {
							for (let i = 0; i < ref.length; i++) {
								const element = ref[i];
								if (element?.valid) {
									let rc = await element?.valid?.();
									result = result && rc;
								}
								if (element?.validate) {
									let rf = await this._valid(ref);
									result = result && rf;
								}
								if (element?.form_validate) {
									let rf = await this._valid(
										ref,
										'form_validate',
									);
									result = result && rf;
								}
							}
						} else {
							if (ref?.valid) {
								let rc = await ref?.valid?.();
								result = result && rc;
							}
							if (ref?.validate) {
								let rf = await this._valid(ref);
								result = result && rf;
							}
							if (ref?.form_validate) {
								let rf = await this._valid(
									ref,
									'form_validate',
								);
								result = result && rf;
							}
						}
					}

					resolve(result);
				});
			},
		},
	};
</script>

<style lang="scss" scoped>
	.box {
		margin: 20px;
		padding: 20px;
		border-radius: 8px;
		background-color: #fff;
		box-shadow: 0px 1px 3px 1px rgba(0, 28, 54, 0.11);
		.title {
			font-size: 16px;
			font-family: PingFangSC, PingFang SC;
			font-weight: 500;
			color: #333333;
			line-height: 22px;
			padding-bottom: 15px;
			border-bottom: 1px solid #e9e9e9;
		}
	}
</style>
